<template>
	<view class="sharepannel" :class="'share-'+platform">
		<view class="cu-modal bottom-modal" v-if="platform=='app'" :class="showshare?'show':''">
			<view class="cu-dialog">
				<view class="cu-bar bg-white">
					<view class="action">分享到...</view>
					<view class="action text-blue" @tap="doclose">取消</view>
				</view>
				<view class="padding-sm text-black">
					<view class="grid text-center" :class="'col-'+(shareinfo.providers+1)">
						<view class="share-item" @click="doshare(index)" v-if="item.switch" v-for="(item, index) in shareinfo.provider" :key="index">
							<image mode="aspectFit" :src="'/static/images/icon/'+item.icon"></image>
							<view class="padding-xs">{{item.title}}</view>
						</view>
						<view class="share-item" @click="docopy(shareinfo.url)">
							<view class="text-xxxl bg-yellow round">
								<text class="cuIcon-copy text-white"></text>
							</view>
							<view class="padding-xs">复制链接</view>
						</view>
					</view>
				</view>
			</view>
		</view>
		<view class="cu-modal sharemodal" v-else :class="showshare?'show':''">
			<view class="bg-arrow"></view>
			<view class="text-white padding-xl center">
				<text class="text-xl">1.点击右上角的</text><button class="cu-btn line-white sm margin-left-sm margin-right-sm"><text class="cuIcon-more text-xl"></text></button>
				<text class="text-xl">按钮</text>
				<view class="text-xl">
					2.点击【发送给朋友】或【分享到朋友圈】
				</view>
				<view class="text-xl">将精彩信息分享出去</view>
				<view class="text-center padding-top">
					<button @click="doclose" class="cu-btn line-white lg">返回</button>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	//import core from "@/static/core.js"
	
	export default {
		name: 'share',
		props: {
			showshare:{
				type:Boolean,
				default:false
			},
			platform:{
				type:String,
				default:'h5'
			},
			shareinfo : {
				type:Object,
				default:function(){
					return {
						title:'',
						summary:'',
						url:'',
						cover:'',
						providers:4,
						provider:{}
					}
				}
			}
		},
		computed:{
			
		},
		methods:{
			doclose(){
				this.$emit('closeshare');
			},
			doshare(provider){
				if(provider=='') return false;
				let scene = provider=='wxtimeline' ? 'WXSenceTimeline' : 'WXSceneSession';
				let _provider = provider=='wxtimeline'?'weixin':provider;
				let sharetype = provider == 'qq' ? 1 : 0;
				let that = this;
				let summary = this.shareinfo.summary;
				if(provider == 'qq') summary = this.shareinfo.title + ':' + summary + ' 详情请戳：'+ this.shareinfo.url;
				uni.share({
				    provider: _provider,
				    scene: scene,
				    type: sharetype,
					title:this.shareinfo.title,
					imageUrl:this.shareinfo.cover,
					href:this.shareinfo.url,
				    summary: summary,
				    success: function (res) {
						//uni.toast('分享成功！','','success');
						uni.showToast({
						     title: '分享成功',
						     duration: 2000
						 });
						that.doclose();
				    },
				    fail: function (err) {
				        console.log("fail:" + JSON.stringify(err));
						//core.toast('分享失败');
						uni.showToast({
						     title: '分享失败',
						     duration: 2000
						 });
				    }
				});
			},
			docopy(text){
				return core.copy(text);
			}
		}
	}
</script>

<style>
	.sharemodal{z-index: 100000; background: rgba(0, 0, 0, 0.8);}
	.sharemodal .bg-arrow{position: absolute; right: 0; top: 0; width: 188upx; height: 172upx; background: url(@/static/other/bg_arrow_topright.png) no-repeat center; background-size: contain;}
	.share-wxapp .bg-arrow{top: calc(var(--status-bar-height) + 120upx); right: 150upx;}
	.sharemodal .center{vertical-align: middle; display: inline-block; text-align: left; line-height: 70upx;}
</style>
